<template>
    <view class="footer-view">
        <scroll-view :scroll-top="0" scroll-y="true" :style="{ height: listHeight + 'rpx' }">
            <eui-card title="意向商户" showTitleLine="true" h-padding="20" type="upDownSingle">
                <template v-slot:content>
                    <view class="m-main-top">
                        <eui-text :value="mainData.c_provider" :name="mainData.c_provider_name" type="titlename"
                            title="商户名称" occupy />
                        <eui-text :value="getDictName('经营方式', mainData.c_con_type)" type="name" title="经营方式" occupy />
                        <eui-text :value="getRelatedName('rdsBrands', mainData.c_bcode)" type="name" title="品牌" />
                        <eui-text :value="getRelatedName('rdsGdsclasses', mainData.c_ccode)" type="name" title="品类" />
                        <eui-text :value="mainData.c_link_man" type="name" title="联系人" />
                        <eui-text :value="mainData.c_link_tele" type="name" title="联系电话" />
                    </view>
                </template>
            </eui-card>
            <eui-card title="意向铺位" showTitleLine="true" h-padding="20" type="upDownSingle">
                <template v-slot:content>
                    <view class="m-main-top">
                        <eui-text :value="mainData.c_store_id" :name="getRelatedName('rdsStores', mainData.c_store_id)"
                            type="titlename" title="机构" occupy />
                        <eui-text :value="mainData.c_counter_no" type="name"
                            :title="mainData.c_position == '1' ? '意向铺位' : '意向点位'" />
                        <eui-text :value="mainData.c_use_area" type="price" title="计租面积" />
                        <eui-text
                            :value="(mainData.c_st_dt ? mainData.c_st_dt.substring(0, 10) : '') + ' ~ ' + (mainData.c_en_dt ? mainData.c_en_dt.substring(0, 10) : '')"
                            type="name" title="租赁日期" occupy />
                    </view>
                </template>
            </eui-card>
            <eui-card title="核心条款" showTitleLine="true" h-padding="20" type="upDownSingle">
                <template v-slot:content>
                    <view v-for="(item, index) in detailData" class="m-list-top">
                        <eui-text :value="item.c_article_name" type="name" :title="`${index + 1}. 费用`" occupy />
                        <eui-text :value="item.c_amount" type="price" title="费用金额" precision="2" />
                        <eui-text :value="item.c_rate" type="price" title="费率(%)" precision="2" />
                        <eui-text :value="item.c_value" type="price" title="费用标准" precision="2" />
                        <eui-text :value="getDictName('招商标准定义标准值单位', item.c_unit)" type="name" title="单位" />
                        <eui-text :value="item.c_min" type="price" title="最小值" precision="2" />
                        <eui-text :value="item.c_max" type="price" title="最大值" precision="2" />
                    </view>
                </template>
            </eui-card>
            <eui-card title="预收费用" showTitleLine="true" h-padding="20" type="upDownSingle">
                <template v-slot:content>
                    <view v-for="(item, index) in intentionFee" class="m-list-top">
                        <eui-text :value="getFeeItemName(item.c_fee_code)" type="name" :title="`${index + 1}. 费用`"
                            occupy />
                        <eui-text :value="item.c_amount" type="price" title="费用金额" precision="2" />
                        <eui-text :value="getDictName('供应商收费征收方式', item.c_pay_method)" type="name" title="收款方式" />
                        <eui-text :value="feeMainItems.find(x => x.value === item.c_fee_main)?.title" type="name"
                            title="征收主体" occupy />
                        <eui-text :value="item.c_dt_start" type="date" title="开始日期" />
                        <eui-text :value="item.c_dt_end" type="date" title="结束日期" />
                    </view>
                </template>
            </eui-card>
        </scroll-view>
    </view>
</template>

<script setup type="ts">
import service from '@/common/service';
import { getRelatedName, getFeeItemName } from '../RdsViews/components/RelatedName.js';
import { getRdsUrl, rdsRequest } from '@/hooks/rdsServices';
import { onMounted, ref } from "vue";
import { useFeeHook } from '@/hooks/useFeeHook'
const { feeMainItems } = useFeeHook();
const rdsUrl = getRdsUrl();
const disabled = ref(true);
const mainData = ref({});
const detailData = ref([]);
const intentionFee = ref([]);

const currentIndex = ref(0);
const rdsDict = ref([])
const props = defineProps({
    data: {
        type: Object
    },
    windowWidth: {
        type: Number,
        default: 0,
    }
});
const listHeight = ref(300);
onMounted(async () => {
    await getListHeight();
    service.enjoyShowLoading('正在加载...');
    await getAllDicData();
    if (props.data.BillId) {
        await billQuery(props.data.BillId);
    }
    service.enjoyHideLoading();
})

// 获取列表高度
const getListHeight = async () => {
    uni.getSystemInfo({
        success: function (res) { // res - 各种参数
            let info = uni.createSelectorQuery().select(".footer-view");
            info.boundingClientRect(function (data) { //data - 各种参数
                //获取列表高度
                let height = res.windowHeight - (data?.top || 0);
                //转换rpx
                listHeight.value = height / (res.windowWidth / 750) - 110;
            }).exec()
        }
    });
};
// 获取字典数据
const getAllDicData = async () => {
    rdsDict.value = await service.getLocalStorage('rdsDict');
};
const getDictName = (key, value) => {
    const dictMap = rdsDict.value.find(x => x.c_class_name === key && x.c_id === value);
    return dictMap ? dictMap.c_name : '';
};
const confirm = async (t, v) => {
    switch (t) {
        case 'reset'://展开
            disabled.value = !disabled.value;
            currentIndex.value = v;
            await shouldShow({ itemIndex: v, currentIndex: currentIndex.value });
            break;
    }
};
// 获取单据详情信息
const billQuery = async (billId) => {
    if (!billId) {
        return;
    }
    const result = await rdsRequest(rdsUrl.bcApi, '意向申请单', 'EnjoyBillQuery', { BillId: billId, }, 'D21');
    if (result.ds.length > 0) {
        mainData.value = result.ds[0];
        detailData.value = result.ds1;
        intentionFee.value = result.ds2;
    }
    console.log('feeMainItems.data', feeMainItems.value);
}
const shouldShow = async ({ itemIndex: itemIndex, currentIndex: currentIndex }) => {
    // 控制单元格的显示状态
    if (disabled.value && itemIndex == currentIndex) {
        return 'none';
    }
    return '';
}
</script>

<style lang="scss" scoped>
@import '@/static/font/enjoyicon/iconfont.css';
@import '@/main.scss';

.footer-view {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.paging-view {
    display: flex;
    flex: 1;
    flex-direction: column;
    background: $uni-bg-color-inverse;
    border-radius: 20rpx;
    margin: 10rpx 20rpx;
}


.m-main-top {
    width: 100%;
    display: grid;
    grid-template-columns: 50% 50%;
    font-size: 12px;
}

.m-list-top {
    width: 100%;
    display: grid;
    grid-template-columns: 50% 50%;
    font-size: 12px;
    padding: 10rpx 0;
}
</style>
